docs: light mode dark mode #8050
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- Added dark mode support in global CSS with new color variables. - Refactored ThemeScript component to improve theme preference handling. - Updated theme toggle components to accept class props for better styling. - Simplified theme toggle logic in ThemeToggle component. - Removed deprecated ThemeScript import from root component. - Cleaned up unused CSS styles related to theme toggle.
|
built with Refined Cloudflare Pages Action⚡ Cloudflare Pages Deployment
|
- Added CSS rules for dark mode image filtering and temporary workarounds. - Updated theme toggle components to remove unused imports and streamline code. - Introduced light mode styles for ecosystem elements based on user preferences.
- Added dark mode styles for various components including code sandbox and API documentation. - Removed sun-and-moon theme toggle components and associated CSS to streamline the codebase. - Updated theme icon styles for better responsiveness and consistency.
gioboa
previously requested changes
Oct 13, 2025
There was a problem hiding this comment.
Thanks for your help @JerryWu1234
with this change the top right icons are not visible anymore. 🤔
https://qwik.dev/ |
gioboa
reviewed
Oct 13, 2025
done |
wmertens
requested changes
Oct 14, 2025
- Removed dark mode CSS rules from global styles and various components to simplify the codebase. - Updated theme toggle logic to improve responsiveness and ensure consistent theme application based on user preferences. - Enhanced theme script to handle theme attributes more robustly.
- Changed the fill attribute in Discord, GitHub, and Twitter logo SVGs from a specific color to 'currentColor' for better adaptability in different themes. - Cleaned up unnecessary CSS rules in the API styles to enhance maintainability.
- Moved the ThemeScript import to the theme-toggle component for better structure. - Removed the obsolete theme-script file to clean up the codebase. - Updated the colorSchemeChangeListener import to reflect the new file structure.
- Updated the theme toggle button styles to improve layout and alignment. - Added conditional text display for theme preference on smaller screens. - Adjusted visibility of theme icons based on screen size for a cleaner UI.
|
@wmertens done |
- Created a new load-theme.js file to encapsulate the theme loading logic. - Updated ThemeScript component to import and utilize the new loadThemeScript for improved code organization and maintainability.
- Eliminated the immediately invoked function expression (IIFE) in load-theme.js to simplify the theme loading logic. - Improved readability and maintainability of the theme loading process.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What is it?
Description
Feature: Add System-Sync ("Auto") Theme to Docs
Checklist
pnpm change